<template>
  <f7-page>
    <f7-navbar title="Forms" back-link="Back" sliding>
      <f7-nav-right>
        <f7-link icon="icon icon-bars" open-panel="left"></f7-link>
      </f7-nav-right>
    </f7-navbar>
    <f7-block>Framework7 provides very flexible forms layout, you can use it with/out icons, with/out labels, or mixed layouts.</f7-block>
    <f7-list media-list>
      <f7-list-item
        media="<i class='icon icon-f7'></i>"
        title="Form Elements"
        link="/forms/formElements/"
      ></f7-list-item>
      <f7-list-item
        media="<i class='icon icon-f7'></i>"
        title="Checkboxes And Radios"
        link="/forms/checkboxesAndRadios/"
      ></f7-list-item>
      <f7-list-item
        media="<i class='icon icon-f7'></i>"
        title="Smart Selects"
        link="/forms/smartSelects/"
      ></f7-list-item>
      <f7-list-item
        media="<i class='icon icon-f7'></i>"
        title="Buttons"
        link="/forms/buttons/"
      ></f7-list-item>
      <f7-list-item
        media="<i class='icon icon-f7'></i>"
        title="Form Storage"
        link="/forms/formStorage/"
      ></f7-list-item>
    </f7-list>
  </f7-page>
</template>

<script>
export default {
  
}
</script>

<style lang="less">

</style>
